/**
 * UI系统 - 显示游戏状态信息
 */
import { System, World } from '../ecs';
import { GameState, WaveManager, Health } from '../components';

export class UISystem implements System {
  priority = 100; // 最后渲染UI

  update(deltaTime: number, world: World): void {
    const ctx = world.resources.ctx as CanvasRenderingContext2D;
    const gameState = this.getGameState(world);
    const waveManager = this.getWaveManager(world);
    const playerHealth = this.getPlayerHealth(world);

    if (!ctx) return;

    this.drawUI(ctx, gameState, waveManager, playerHealth, world);
  }

  private drawUI(
    ctx: CanvasRenderingContext2D, 
    gameState: GameState | null, 
    waveManager: WaveManager | null,
    playerHealth: Health | null,
    world: World
  ): void {
    const { width, height } = world.resources;

    // 设置UI样式
    ctx.save();
    ctx.fillStyle = '#ffffff';
    ctx.font = '20px Arial';
    ctx.textAlign = 'left';

    // 绘制分数
    if (gameState) {
      ctx.fillText(`分数: ${gameState.score}`, 20, 30);
      ctx.fillText(`生命: ${gameState.lives}`, 20, 60);
    }

    // 绘制波次信息
    if (waveManager) {
      ctx.fillText(`第 ${waveManager.currentWave} 波`, 20, 90);
      
      if (waveManager.isWaveActive) {
        const aliveEnemies = Array.from(world.entities).filter(e => e.hasComponent('enemyAI')).length;
        ctx.fillText(`敌机剩余: ${aliveEnemies}`, 20, 120);
      } else {
        const currentTime = performance.now() / 1000;
        const timeLeft = Math.max(0, waveManager.timeBetweenWaves - (currentTime - waveManager.waveStartTime));
        if (timeLeft > 0) {
          ctx.fillText(`下一波倒计时: ${Math.ceil(timeLeft)}`, 20, 120);
        }
      }
    }

    // 绘制玩家血条
    if (playerHealth) {
      const barWidth = 200;
      const barHeight = 20;
      const barX = 20;
      const barY = height - 40;

      // 血条背景
      ctx.fillStyle = '#333333';
      ctx.fillRect(barX, barY, barWidth, barHeight);

      // 血条
      const healthPercent = playerHealth.current / playerHealth.max;
      const healthColor = healthPercent > 0.6 ? '#00ff00' : 
                         healthPercent > 0.3 ? '#ffff00' : '#ff0000';
      
      ctx.fillStyle = healthColor;
      ctx.fillRect(barX, barY, barWidth * healthPercent, barHeight);

      // 血条边框
      ctx.strokeStyle = '#ffffff';
      ctx.lineWidth = 2;
      ctx.strokeRect(barX, barY, barWidth, barHeight);

      // 血量文字
      ctx.fillStyle = '#ffffff';
      ctx.font = '14px Arial';
      ctx.textAlign = 'center';
      ctx.fillText(`${Math.max(0, playerHealth.current)}/${playerHealth.max}`, barX + barWidth / 2, barY + 14);
    }

    // 游戏结束界面
    if (gameState && gameState.gameOver) {
      this.drawGameOverScreen(ctx, gameState, width, height);
    }

    // 暂停界面
    if (gameState && gameState.paused) {
      this.drawPauseScreen(ctx, width, height);
    }

    ctx.restore();
  }

  private drawGameOverScreen(ctx: CanvasRenderingContext2D, gameState: GameState, width: number, height: number): void {
    // 半透明背景
    ctx.fillStyle = 'rgba(0, 0, 0, 0.8)';
    ctx.fillRect(0, 0, width, height);

    // 游戏结束文字
    ctx.fillStyle = '#ff4444';
    ctx.font = 'bold 48px Arial';
    ctx.textAlign = 'center';
    ctx.fillText('游戏结束', width / 2, height / 2 - 60);

    // 最终分数
    ctx.fillStyle = '#ffffff';
    ctx.font = '24px Arial';
    ctx.fillText(`最终分数: ${gameState.score}`, width / 2, height / 2 - 10);

    // 重新开始提示
    ctx.font = '18px Arial';
    ctx.fillText('按 R 键重新开始', width / 2, height / 2 + 40);
  }

  private drawPauseScreen(ctx: CanvasRenderingContext2D, width: number, height: number): void {
    // 半透明背景
    ctx.fillStyle = 'rgba(0, 0, 0, 0.6)';
    ctx.fillRect(0, 0, width, height);

    // 暂停文字
    ctx.fillStyle = '#ffffff';
    ctx.font = 'bold 36px Arial';
    ctx.textAlign = 'center';
    ctx.fillText('游戏暂停', width / 2, height / 2);

    // 继续提示
    ctx.font = '18px Arial';
    ctx.fillText('按 ESC 键继续', width / 2, height / 2 + 40);
  }

  private getGameState(world: World): GameState | null {
    const entities = Array.from(world.entities).filter(e => e.hasComponent('gameState'));
    if (entities.length > 0) {
      const component = entities[0].getComponent('gameState');
      return component ? component as GameState : null;
    }
    return null;
  }

  private getWaveManager(world: World): WaveManager | null {
    const entities = Array.from(world.entities).filter(e => e.hasComponent('waveManager'));
    if (entities.length > 0) {
      const component = entities[0].getComponent('waveManager');
      return component ? component as WaveManager : null;
    }
    return null;
  }

  private getPlayerHealth(world: World): Health | null {
    const players = Array.from(world.entities).filter(e => e.hasComponent('player') && e.hasComponent('health'));
    if (players.length > 0) {
      const component = players[0].getComponent('health');
      return component ? component as Health : null;
    }
    return null;
  }
}